import React from 'react'
import {connect} from 'react-redux'
import {addTodo} from "../Action/ActionTypes";

class AddTodo extends React.Component{
    constructor(props){
        super(props)
        this.textInput = null;
        this.submitTodo = this.submitTodo.bind(this)
    }

    submitTodo(e){
        e.preventDefault()
        let text = this.textInput.value.trim();
        if(!text){
            alert('内容不能为空')
            return
        }
        this.props.dispatch(addTodo(text));//分发添加TODO事件
        this.textInput.value = '';
        this.textInput.focus()
    }

    render(){
        return (
            <form onSubmit={this.submitTodo}>
                <input ref={node=>{this.textInput = node}}/>
                <button type='submit'>Add Todo</button>
            </form>
        )
    }
}

export default connect()(AddTodo);